<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>瀑布流布局</title>
	<link rel="stylesheet" href="css/style.css">

</head>
<body>
	<div id="main" class="main">
		<div class="box">
			<div class="box-pic">
				<img src="images/1.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/2.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/3.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/4.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/5.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/6.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/7.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/8.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/9.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/10.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/11.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/12.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/1.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/2.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/3.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/4.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/5.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/6.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/7.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/8.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/9.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/10.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/11.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/12.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/1.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/2.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/3.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/4.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/5.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/6.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/7.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/8.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/9.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/10.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/11.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/12.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/1.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/2.jpg">
			</div>
		</div>
		<div class="box">
			<div class="box-pic">
				<img src="images/3.jpg">
			</div>
		</div>
	</div>
	<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
	<script type="text/javascript" src="js/waterfall.js"></script>
</body>
</html>